<template>

    <div class="menu_ico">
      <img src="../assets/images/lan.png" @click="show = true" alt="">
    </div>

  <n-drawer
      v-model:show="show"
      :width="width"
      :placement="placement"
      block-scroll
      content-style="background: rgba(47, 119, 238, 0.8);">
    <div class="menu">
      <ul>
        <dt class="close"><img @click="show=false" src="../assets/images/close.png" alt=""></dt>
        <li class=""><a @click="goto(0)"><span>关于我们</span></a></li>
        <li><a @click="goto(5)"><span>投资重点</span></a></li>
        <li><a @click="goto(6)"><span>项目投资</span></a></li>
        <li><a @click="goto(7)"><span>新闻中心</span></a></li>
        <li><a @click="goto(8)"><span>联系我们</span></a></li>
      </ul>
    </div>
  </n-drawer>
</template>

<script>
import {defineComponent, ref} from "vue";

export default defineComponent({
  setup() {
    return {
      show: ref(false),
      placement: ref('left'),
      width: document.body.clientWidth / 3,
    };
  },

  methods: {
    goto(n) {
      this.$parent.jump(n)
    },
    menuWidth() {
      if (this.width <= 400) {
        this.width = 400
      }
    }
  },
  created() {
    this.menuWidth();
  }
});
</script>